<template>
    <div class="user-credit-report-list">
        <div class="mine-main" v-if='pageLoaded'>
            <ul class="menu-list" v-if='reportInfo'>
                <li class="menu__item" @click='goZmxy'>
                    <p>1. 芝麻信用</p>
                    <div v-if='reportInfo.CREDIT.state == "SUCCESS"'>最近更新:{{reportInfo.CREDIT.updatedAt | dateFormat}}</div>
                    <div v-else>待完善</div>
                    <i class='iconfont icon-arrow'></i>
                </li>
                <li class="menu__item" @click='goUserInfo'>
                    <p>2. 用户详细信息</p>
                    <div v-if='reportInfo.USER_INFO.state == "SUCCESS"'>最近更新:{{reportInfo.USER_INFO.updatedAt | dateFormat}}</div>
                    <div v-else>待完善</div>
                    <i class='iconfont icon-arrow'></i>
                </li>
                <li class="menu__item menu__button" @click='goDetail' v-if="newest.payState == 'SUCCESS'">
                    <div class='button'>查看信用报告</div>
                </li>
            </ul>
        </div>

        <confirm 
            :show='show_modal_gopay'
            @close='show_modal_gopay = false'
            @confirm='goPay'
            title='支付'
            tips='重新认证需要支付费用，是否支付？'></confirm>
    </div>
</template>

<script>
    import { Promise } from 'es6-promise'
    import footerBar from '../components/FooterBar.vue'
    import selectGroup from '../components/SelectGroup.vue'
    import selectOption from '../components/SelectOption.vue'
    import radioGroup from '../components/RadioGroup.vue'
    import areaSelect from '../components/AreaSelect.vue'
    import radio from '../components/Radio.vue'
    import loading from '../components/Loading.vue'
    import checkBox from '../components/CheckBox.vue'
    import toolTip from '../components/ToolTip.vue'
    import modal from '../components/Modal.vue'
    import confirm from '../components/Confirm.vue'
    import buttonLoading from '../components/ButtonLoading.vue'
    import pagination from '../components/Pagination.vue'
    import payPassword from '../components/PayPassword.vue'
    import pickerList from '../components/PickerList.vue'
    import tabBox from '../components/TabBox.vue'
    import tab from '../components/Tab.vue'
    import toggle from '../components/Toggle.vue'
    import dateFormat from '../filters/filter-dateFormat'
    import mixinReport from '../mixins/mixin-report'
    import  { mapGetters, mapActions }  from 'vuex'
    import { addLenderValidation, resetAccountPasswordValidation, operatorEditValidation } from '../validation/validation'
    import { reportApi, userApi } from '../api/api'
    import moment from 'moment'

    export default {
        mixins: [mixinReport],
        components:{
            footerBar,
            selectGroup,
            selectOption,
            radioGroup,
            radio,
            checkBox,
            areaSelect,
            loading,
            toolTip,
            modal,
            confirm,
            buttonLoading,
            pagination,
            payPassword,
            pickerList,tabBox,
            tab,
            toggle
        },
        filters:{
            dateFormat,
        },
        data() {
            return {
                pageLoaded:false,
                placeholder:'--',
                newest:{},
                show_modal_gopay:false,
            }
        },
        computed:{
            ...mapGetters([
                'msgTip',
                'localInfo'
            ]),
            userInfo(){
                return this.localInfo.userInfo || {}
            },
            reportInfo(){
                return this.userInfo.reportInfo || {}
            },
        },
        methods:{
            // actions
            ...mapActions([
                'showLoading',
                'hideLoading',
                'setMsgTip',
                'setGoHome'
            ]),

            // filters
            timestampToDate(timestamp){
                if(!timestamp) return this.placeholder
                return moment(timestamp).format('YYYY-MM-DD')
            },

            // function

            goPay(){
                // if(this.reportInfo.USER_INFO.needRepay){
                    this.$router.push({
                        name:'user-credit-report-index',
                        params:{
                            no:'default'
                        },
                        query:{
                            type:'pass'
                        }
                    })
                // }
            },

            goUserInfo(){
                // if(this.newest.needRepay){
                //     this.show_modal_gopay = true
                //     return
                // }
                if(this.reportInfo.CREDIT.state != 'SUCCESS'){
                    this.setMsgTip({
                        text:'请先完成芝麻信用',
                        type:'warn'
                    })
                    return
                }

                this.$router.push({
                    name:'user-credit-report-user-info',
                    params:{
                        no:this.newest.creditReportNo
                    }
                })
            },

            goZmxy(){
                // if(this.newest.needRepay){
                //     this.show_modal_gopay = true
                //     return
                // }

                // if(this.reportInfo.USER_INFO.state == 'SUCCESS'){
                    this.$router.push({
                        name:'user-credit-report-zmxy',
                        params:{
                            no:this.newest.creditReportNo
                        }
                    })
                // }
                // else{
                //     this.setMsgTip({
                //         text:'请按顺序完成信用认证',
                //         type:'warn'
                //     })
                //     this.$router.push({
                //         name:'user-credit-report-user-info',
                //         params:{
                //             no:this.newest.creditReportNo
                //         }
                //     })
                // }
            },
            goDetail(){
                this.$router.push({
                    name:'user-credit-report-detail',
                    params:{
                        no:'default'
                    }
                })
            },
            getNewest(){
                this.showLoading()
                reportApi.newest()
                .then(result=>{
                    this.newest = result
                    // if(result.status == 'OK'){
                    //     this.$router.replace({
                    //         name:'user-credit-report-detail',
                    //         params:{
                    //             no:'default'
                    //         }
                    //     })
                    //     return
                    // }
                    if(result.status == 'OK'){
                        this.pageLoaded = true
                        this.hideLoading()
                    }
                    if(!result.creditReportNo){
                        this.getNewCreate()
                        return
                    }
                    if(result.payState != 'SUCCESS' || result.status != 'OK'){
                        if(_.isEmpty(this.reportInfo)){
                            this.$router.replace({
                                name:'user-credit-report-zmxy',
                                params:{
                                    no:result.creditReportNo
                                }
                            })
                            return
                        }
                        if(this.reportInfo.CREDIT.state != 'SUCCESS'){
                            this.$router.replace({
                                name:'user-credit-report-zmxy',
                                params:{
                                    no:result.creditReportNo
                                }
                            })
                            return
                        }
                        if(this.reportInfo.USER_INFO.state != 'SUCCESS'){
                            this.$router.replace({
                                name:'user-credit-report-user-info',
                                params:{
                                    no:result.creditReportNo
                                }
                            })
                            return
                        } 
                        this.$router.replace({
                            name:'user-credit-report-user-info',
                            params:{
                                no:result.creditReportNo
                            }
                        })
                        
                    }
                })
                .catch(error => {
                    console.error(error)
                    this.hideLoading()
                    this.pageLoaded = true
                })
            },
            getNewCreate(){
                this.showLoading()
                reportApi.newCreate()
                .then(result=>{
                    this.getNewest()
                })
                .catch(error => {
                    console.error(error)
                    this.hideLoading()
                    this.pageLoaded = true
                })
            },
        },
        created(){
            this.setGoHome(true)
            this.getNewest()

        }
    }
</script>

<style lang="scss">
    @import "../sass/variables";
    @import "../sass/extends";
    @import "../sass/mixins";
    .user-credit-report-list{
        .menu-list{
            padding-bottom: 2px;
        }
    }

</style>
